<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>定时器</title>
    <style>
        body{
            background: url("images/time/bg.png") no-repeat;
            background-size: cover;
            color: white;
            font-size: 50px;;
        }
    </style>
</head>
<body>
<img src="images/time/0.png" alt="">
<img src="images/time/0.png" alt="">
:
<img src="images/time/0.png" alt="">
<img src="images/time/0.png" alt="">
:
<img src="images/time/0.png" alt="">
<img src="images/time/0.png" alt="">
<script>
    function toDou(obj){
        if (obj<9){
            return "0"+obj;
        }else{
            return ""+obj;
        }
    }
var p='12313131';
    window.onload= function () {
        var aImg=document.getElementsByTagName("img");
        function show(){
            var oDate=new Date();//获取当地时间
            var str=toDou(oDate.getHours())+toDou(oDate.getMinutes())+toDou(oDate.getSeconds())
            for (var i=0;i<aImg.length;i++){
             //aImg[i].src="images/time/"+str[i]+".png"  不兼容ie7
//charAt()专门用来获取字符串下标元素的，兼容ie老版本
                aImg[i].src="images/time/"+str.charAt(i)+".png"
            }
        }
       setInterval(show,1000)
        show()


    }
</script>
</body>
</html>